<template>
  <div class="xiecheng">
    <div class="admin_main_block">
      <div class="admin_main_block_top">
        <div class="admin_main_block_left">
          <div>{{ i18n('member.order.view') }}</div>
        </div>

        <div class="admin_main_block_right">
          <div>
            <el-button icon="Back" @click="router.go(-1)">
              {{ i18n('common.return') }}
            </el-button>
          </div>
        </div>
      </div>

      <div class="admin_form_main">
        <el-descriptions border :column="2">
          <el-descriptions-item :label="i18n('member.order.order_no')">
            {{ dataForm.order_no }}
          </el-descriptions-item>
          <el-descriptions-item :label="i18n('member.order.order_type')">
            {{ dataForm.order_type.text }}
          </el-descriptions-item>


          <el-descriptions-item :label="i18n('member.order.order_info')">
            <el-text v-if="dataForm.contract && dataForm.order_type.value == 1">
              {{ dataForm.contract.chinese_title }}
            </el-text>
            <el-text v-if="dataForm.refuel && dataForm.order_type.value == 2">
              {{ dataForm.refuel.chinese_title }}
            </el-text>
          </el-descriptions-item>
          <el-descriptions-item :label="i18n('member.order.money')">
            <el-text tag="b" type="danger" v-if="dataForm.contract && dataForm.order_type.value == 1">
              {{ dataForm.contract.money }}元
            </el-text>
            <el-text tag="b" type="danger" v-if="dataForm.refuel && dataForm.order_type.value == 2">
              {{ dataForm.refuel.money }}元
            </el-text>
          </el-descriptions-item>


          <el-descriptions-item :label="i18n('member.chinese_nickname')">
            <el-text v-if="dataForm.member">
              {{ dataForm.member.chinese_nickname }}
            </el-text>
          </el-descriptions-item>
          <el-descriptions-item :label="i18n('member.chinese_mobile')">
            <el-text v-if="dataForm.member">
              {{ dataForm.member.username }}
            </el-text>
          </el-descriptions-item>


          <el-descriptions-item :label="i18n('member.order.pay_type')">
            <el-text>
              {{ dataForm.pay_type }}
            </el-text>
          </el-descriptions-item>
          <el-descriptions-item :label="i18n('member.order.pay_money')">
            <el-text tag="b" type="danger">
              {{ dataForm.pay_money }}元
            </el-text>
          </el-descriptions-item>


          <el-descriptions-item :label="i18n('member.order.pay_status')">
            <el-text>
              {{ dataForm.pay_status }}
            </el-text>
          </el-descriptions-item>
          <el-descriptions-item :label="i18n('member.order.pay_time')">
            <el-text>
              {{ dataForm.pay_time }}
            </el-text>
          </el-descriptions-item>


          <el-descriptions-item :label="i18n('member.order.create_time')">
            <el-text>
              {{ dataForm.create_time }}
            </el-text>
          </el-descriptions-item>
        </el-descriptions>
      </div>
    </div>
  </div>
</template>

<script setup name="member-order-view">
  import { useBase } from "@/hooks/base/useBase"
  import { useForm } from "@/hooks/form/useForm"

  const { router, query, i18n, isAuth } = useBase()

  const model = ref('member/order')

  const dataForm = reactive({
    id: 0,
    avatar: '',
    username: '',
    chinese_nickname: '',
    order_no: '',
    order_type: '',
    member: '',
    contract: '',
    refuel: '',
    pay_type: '',
    pay_money: '',
    pay_status: '',
    pay_time: '',
    create_time: '',
  })

  const init = () => {
    dataForm.id = query.id || 0

    if (dataForm.id) {
      $http({
        url: $http.adornUrl(`/${model.value}/view/${dataForm.id}`),
        method: 'get',
        params: $http.adornParams({}),
      }).then(({ data }) => {
        if (data && data.status === 200) {
          dataForm.id = data.data.id
          dataForm.order_no = data.data.order_no
          dataForm.order_type = data.data.order_type
          dataForm.member = data.data.member
          dataForm.contract = data.data.contract
          dataForm.refuel = data.data.refuel
          dataForm.pay_type = data.data.pay_type.text
          dataForm.pay_money = data.data.pay_money
          dataForm.pay_status = data.data.pay_status.text
          dataForm.pay_time = data.data.pay_time
          dataForm.create_time = data.data.create_time
        }
      })
    }
  }

  onMounted(() => {
    init()
  })
</script>
